<!-- 反馈信息 -->
<template>
	<view class="page-content">
		<view class="scroll-Y pagebt75">
			<u-navbar title="反馈信息" :background="background"></u-navbar>
			<view class="m-3 py-4 px-3 form rounded-8">
				<view class="projectBox rounded-8 bg-write line-h-md">
					<view class="d-flex a-center j-sb ">
						<view class="font text-h">反馈时间：{{ BusInfoTrackDetail.lastNewFeedbackDate }}</view>

						<view class="bg-blue rounded  px-2 py-1 font text-blue">
							{{ BusInfoTrackDetail.lastNewFeedbackPhaseName }}
						</view>
					</view>
					<view class="font-lg text-main font-weight pb-1">{{ BusInfoTrackDetail.projectName }}</view>
					<view class="u-flex u-row-between">
						<view class="bg-grey  px-1 py text-primary font">
							{{ BusInfoTrackDetail.rootInformationTagName }}
						</view>
						<view class="text-primary font">
							<image
								class="imagesBox"
								mode="aspectFit"
								style="width: 46rpx ; height: 16rpx;"
								:src="getStaticFilePath('ico-jd.png')"
							></image>
							{{ BusInfoTrackDetail.projectStageName }}
						</view>
					</view>
					<view class="p-2 my-2 rounded line-h-md bg-grey">
						<view class="d-flex a-center">
							<view class="flex-1 ">
								<text class="text-tips font">信息类型：</text>
								<text class="text-main font ">{{ BusInfoTrackDetail.infoTypeName }}</text>
							</view>
							<view class="flex-1">
								<text class="text-tips font">预计产值规模：</text>
								<text class="text-main font ">{{ BusInfoTrackDetail.outputScale }}</text>
							</view>
						</view>
						<view class="d-flex a-center">
							<view class="flex-1">
								<text class="text-tips font">省份：</text>
								<text class="text-main font ">{{ BusInfoTrackDetail.province }}</text>
							</view>
							<view class="flex-1">
								<text class="text-tips font">城市：</text>
								<text class="text-main font ">{{ BusInfoTrackDetail.city }}</text>
							</view>
						</view>
						<view class="d-flex mt-2 a-center">
							<view class="iconfont icon-calendar-todo-fill text-primary"></view>
							<view class="text-main font  pl-2">{{ BusInfoTrackDetail.projectAddressName }}</view>
						</view>
					</view>
				</view>
			</view>
			<u-form :model="formData" ref="uForm">
				<view class="m-3 py-4 px-3 form rounded-8">
					<view class="font-md font-weight text-main">反馈信息</view>
					<u-form-item class="required" label="反馈阶段" label-position="top" :border-bottom="false">
						<hpy-form-select
							:dataList="followUpList"
							text="label"
							name="value"
							v-model="formData.feedbackPhase"
							title="请选择反馈阶段"
							hideBorder
						/>
					</u-form-item>
					<u-form-item label="接洽内容" label-position="top" :border-bottom="false">
						<u-input
							border
							height="120"
							type="textarea"
							v-model="formData.content"
							placeholder="请输入接洽内容"
						/>
					</u-form-item>
				</view>

				<view class="m-3 py-4 px-3 form rounded-8">
					<view class="font-md font-weight text-main">派生信息</view>
					<view
						class="d-flex bg-primary px-2 py-2 my-2 j-center rounded-8 w-100 text-primary border-light "
						@click="addDerivedInformationFn"
					>
						新增派生信息
					</view>
					<view v-if="formData.deriveBusiInfoList.length">
						<view
							class="p-2 my-2 rounded line-h-md bg-grey"
							v-for="(item, index) in formData.deriveBusiInfoList"
							:key="index"
						>
							<view class="d-flex a-center j-end">
								<view class="flex-1">
									<text class="font-lg text-main font-weight pb-1">{{ item.projectName }}</text>
								</view>
								<view>
									<text
										class="text-primary font-lg iconfont icon-xiugai1 font-weight pr-2"
										@click="editDeriveBusiInfoFn(item, index)"
									></text>
									<text
										class="text-error font-lg iconfont icon-shanchu2 font-weight"
										@click="delDeriveBusiInfoFn(item, index)"
									></text>
								</view>
							</view>
							<view class="d-flex a-center">
								<view class="flex-1">
									<text class="text-tips font">省份：</text>
									<text class="text-main font ">{{ item.province }}</text>
								</view>
								<view class="flex-1">
									<text class="text-tips font">城市：</text>
									<text class="text-main font ">{{ item.city }}</text>
								</view>
							</view>
							<view class="d-flex a-center">
								<view class="flex-1">
									<text class="text-tips font">产业标记：</text>
									<text class="text-main font ">{{ item.busiIndustryNmae }}</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</u-form>
		</view>
		<view class="subarea">
			<button class="warningBnt btn-cancel font-weight-100" @click="hanglgCancelFn">取 消</button>
			<button class="primaryBnt btn-submit font-weight-100" @click="hanglgSubmitFn">提 交</button>
		</view>
	</view>
</template>
<script>
import { followUpList } from '@/utils/data.js';
import {
	getNationAreaByParentId,
	getDictByParentId,
	fillFeedback,
	updateBusiInfoData,
	getbusiInfoData,
	getBusInfoTrackDetail
} from '@/api/apis.js';
export default {
	data() {
		return {
			background: {
				backgroundColor: '#fff'
			},
			BusInfoTrackDetail: {},
			industrialMarkList: [], //产业标记
			formData: {
				busInfoTrackId: '',
				feedbackPhase: '',
				content: '',
				deriveBusiInfoList: []
			},
			initLocation: '',
			showMap: false,
			followUpList, //反馈阶段
			selectedIndustryIds: [] // 用于跟踪已经选择的产业标记ID
		};
	},
	onLoad() {
		this.getprovinceDataFn();
		this.getDictFn();
		if (this.$Route.query.busInfoTrackId) {
			this.formData.busInfoTrackId = this.$Route.query.busInfoTrackId;
			this.getbusiInfoDataFn(this.$Route.query.busInfoTrackId);
		}
		if (uni.getStorageSync('formDataStorage')) {
			uni.removeStorage({
				key: 'formDataStorage'
			});
		}
	},
	onShow() {
		if (uni.getStorageSync('formDataStorage')) {
			let arr = this.$u.deepClone(uni.getStorageSync('formDataStorage'));
			arr.forEach(x => {
				const mappedItems = x.busiIndustryAssignList.map(item => {
					return item.industryName;
				});
				this.$set(x, 'busiIndustryNmae', mappedItems.toString());
			});

			this.formData.deriveBusiInfoList = arr;
		}
	},
	computed: {
		availableIndustrialMarks() {
			return this.industrialMarkList.filter(mark => ({
				...mark,
				disabled: this.selectedIndustryIds.includes(mark.dictId)
			}));
		}
	},
	methods: {
		changeMarkFn(index) {
			this.formData.deriveBusiInfoList[0].busiIndustryAssignList[index].busiIndustryCompanyList = [];
			const selectedId = this.formData.deriveBusiInfoList[0].busiIndustryAssignList[index].industryId;
			// 检查当前选择的产业标记是否与之前选择的不同
			const previousSelection = this.selectedIndustryIds[index];
			if (selectedId && previousSelection !== selectedId && this.selectedIndustryIds.includes(selectedId)) {
				// 如果当前选择的是一个新的且已被之前选择器选中的产业标记，则显示提示并重置选择
				uni.showToast({ title: '该产业标记已被选择，请选择其他标记', icon: 'none' });
				this.formData.busiIndustryAssignList[index].industryId = '';
			} else {
				// 如果当前选择的是一个新的或未被选中的产业标记，则更新记录
				this.selectedIndustryIds[index] = selectedId;
			}
		},
		getAvailableIndustrialMarks(currentIndex) {
			// 返回当前选择器可用的产业标记列表（排除已选中的）
			return this.industrialMarkList.filter(mark => {
				// 检查产业标记是否已被之前的选择器选中
				return !this.selectedIndustryIds.slice(0, currentIndex).includes(mark.value);
			});
		},
		getprovinceDataFn(data) {
			if (data != undefined) {
				getNationAreaByParentId({
					parentId: data.value
				}).then(res => {
					if (res.code == 10000) {
						this.cityDataList = res.data;
					} else {
						this.$u.toast(res.msg);
					}
				});
			} else {
				getNationAreaByParentId({}).then(res => {
					if (res.code == 10000) {
						this.provinceDataList = res.data;
					} else {
						this.$u.toast(res.msg);
					}
				});
			}
		},
		// 获取产业标记
		getDictFn() {
			getDictByParentId({
				parentId: 'COMPANY_SERVICE'
			}).then(res => {
				if (res.code == 10000) {
					this.industrialMarkList = res.data;
					this.industrialMarkList.forEach(x => {
						this.$set(x, 'label', x.name);
						this.$set(x, 'value', x.dictId);
					});
				} else {
					this.$u.toast(res.msg);
				}
			});
		},
		//添加新公司
		addCorpFn(index) {
			if (!this.formData.deriveBusiInfoList[0].busiIndustryAssignList[index].industryId) {
				this.$u.toast('请选择产业标记');
				return false;
			}
			this.$Router.push({
				path: '/detailPages/pages/joinCompany/index',
				query: {
					index: index,
					industryId: this.formData.deriveBusiInfoList[0].busiIndustryAssignList[index].industryId,
					busiIndustryCompanyList: this.formData.deriveBusiInfoList[0].busiIndustryAssignList[
						index
					].busiIndustryCompanyList.map(item => item.companyId)
				}
			});
		},
		//添加目标企业
		addTargetFn() {
			this.formData.deriveBusiInfoList[0].busiIndustryAssignList.push({
				industryId: '',
				industryName: '',
				busiIndustryCompanyList: []
			});
		},

		//取消
		hanglgCancelFn() {
			this.$Router.back();
			uni.removeStorage({
				key: 'formDataStorage'
			});
		},
		//提交
		hanglgSubmitFn() {
			if (this.validRuleFn()) {
				fillFeedback({
					...this.formData
				}).then(res => {
					if (res.code == 10000) {
						this.$Router.replaceAll({
							path: '/pages/infoManagement/index',
							query: {
								current: 0
							}
						});
						uni.removeStorage({
							key: 'formDataStorage'
						});
					} else {
						this.$u.toast(res.msg);
					}
				});
			}
		},
		//校验
		validRuleFn() {
			if (this.formData.feedbackPhase == '') {
				this.$u.toast('请选择反馈阶段');
				return false;
			}

			return true;
		},
		//获取项目详情
		getbusiInfoDataFn(id) {
			getBusInfoTrackDetail({
				busInfoTrackId: id
			}).then(res => {
				if (res.code == 10000) {
					this.BusInfoTrackDetail = res.data;
				} else {
					this.$u.toast(res.msg);
				}
			});
		},
		//新增派生信息
		addDerivedInformationFn() {
			this.$Router.push({
				path: '/detailPages/pages/addDerivedInformation/addDerivedInformation',
				query: {
					busiInfoId: this.BusInfoTrackDetail.busiInfoId
				}
			});
		},
		//删除
		delDeriveBusiInfoFn(data, index) {
			this.formData.deriveBusiInfoList.splice(index, 1);
			let formDataStorage = uni.getStorageSync('formDataStorage') || [];
			formDataStorage.splice(index, 1);
			uni.setStorage({
				key: 'formDataStorage',
				data: this.formData.deriveBusiInfoList
			});
		},
		//修改
		editDeriveBusiInfoFn(data, index) {
			this.$Router.push({
				path: '/detailPages/pages/addDerivedInformation/addDerivedInformation',
				query: {
					index: index
				}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.form {
	background-color: #fff;
	::v-deep .select-picker {
		width: 628rpx !important;
	}
	.inputHight {
		height: 40px;
	}
	.cropanyBox {
		border-bottom: 1px solid #f3f5f8;
		.bb :last-child {
			border-bottom: none !important;
		}
	}
}
</style>
